<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <link rel="stylesheet" href="./index.css">
</head>
<body>
  <div class="shop_box">
    <ul class="sort_btn_box">
      <li>排序：</li>
      <li class='sort_btn'>综合</li>
      <li class='sort_btn'>最新</li>
      <li class='sort_btn'>热度</li>
      <li class='sort_btn'>价格</li>
    </ul>
    <ul class="phone_list_box">
      <li class='li_box'>
        <div class="img_box">
          <img src="https://res.vmallres.com/pimages//product/6901443323777/428_428_2F1BDEE1FA48AA45CEF803EA37F7EDE62A5F333E5AB30D20mp.png" alt="">
        </div>
        <h2>华为手机20s</h2>
        <div class="price_box">
          <span class="price">￥1200.00</span>
          <span class="select_icon">多款可选</span>
        </div>
        <ul class="feature_box">
          <li>好使</li>
          <li>限时抢购</li>
        </ul>
        <div class="comment_box">
          <span>34343人评价</span>
          <span>99%好评</span>
        </div>
      </li>
      <li class='li_box'>
        <div class="img_box">
          <img src="https://res.vmallres.com/pimages//product/6901443323777/428_428_2F1BDEE1FA48AA45CEF803EA37F7EDE62A5F333E5AB30D20mp.png" alt="">
        </div>
        <h2>华为手机20s</h2>
        <div class="price_box">
          <span class="price">￥1200.00</span>
          <span class="select_icon">多款可选</span>
        </div>
        <ul class="feature_box">
          <li>好使</li>
          <li>限时抢购</li>
        </ul>
        <div class="comment_box">
          <span>34343人评价</span>
          <span>99%好评</span>
        </div>
      </li>
      <li class='li_box'>
        <div class="img_box">
          <img src="https://res.vmallres.com/pimages//product/6901443323777/428_428_2F1BDEE1FA48AA45CEF803EA37F7EDE62A5F333E5AB30D20mp.png" alt="">
        </div>
        <h2>华为手机20s</h2>
        <div class="price_box">
          <span class="price">￥1200.00</span>
          <span class="select_icon">多款可选</span>
        </div>
        <ul class="feature_box">
          <li>好使</li>
          <li>限时抢购</li>
        </ul>
        <div class="comment_box">
          <span>34343人评价</span>
          <span>99%好评</span>
        </div>
      </li>
      <li class='li_box'>
        <div class="img_box">
          <img src="https://res.vmallres.com/pimages//product/6901443323777/428_428_2F1BDEE1FA48AA45CEF803EA37F7EDE62A5F333E5AB30D20mp.png" alt="">
        </div>
        <h2>华为手机20s</h2>
        <div class="price_box">
          <span class="price">￥1200.00</span>
          <span class="select_icon">多款可选</span>
        </div>
        <ul class="feature_box">
          <li>好使</li>
          <li>限时抢购</li>
        </ul>
        <div class="comment_box">
          <span>34343人评价</span>
          <span>99%好评</span>
        </div>
      </li>
      <li class='li_box'>
        <div class="img_box">
          <img src="https://res.vmallres.com/pimages//product/6901443323777/428_428_2F1BDEE1FA48AA45CEF803EA37F7EDE62A5F333E5AB30D20mp.png" alt="">
        </div>
        <h2>华为手机20s</h2>
        <div class="price_box">
          <span class="price">￥1200.00</span>
          <span class="select_icon">多款可选</span>
        </div>
        <ul class="feature_box">
          <li>好使</li>
          <li>限时抢购</li>
        </ul>
        <div class="comment_box">
          <span>34343人评价</span>
          <span>99%好评</span>
        </div>
      </li>
      <li class='li_box'>
        <div class="img_box">
          <img src="https://res.vmallres.com/pimages//product/6901443323777/428_428_2F1BDEE1FA48AA45CEF803EA37F7EDE62A5F333E5AB30D20mp.png" alt="">
        </div>
        <h2>华为手机20s</h2>
        <div class="price_box">
          <span class="price">￥1200.00</span>
          <span class="select_icon">多款可选</span>
        </div>
        <ul class="feature_box">
          <li>好使</li>
          <li>限时抢购</li>
        </ul>
        <div class="comment_box">
          <span>34343人评价</span>
          <span>99%好评</span>
        </div>
      </li>
      <li class='li_box'>
        <div class="img_box">
          <img src="https://res.vmallres.com/pimages//product/6901443323777/428_428_2F1BDEE1FA48AA45CEF803EA37F7EDE62A5F333E5AB30D20mp.png" alt="">
        </div>
        <h2>华为手机20s</h2>
        <div class="price_box">
          <span class="price">￥1200.00</span>
          <span class="select_icon">多款可选</span>
        </div>
        <ul class="feature_box">
          <li>好使</li>
          <li>限时抢购</li>
        </ul>
        <div class="comment_box">
          <span>34343人评价</span>
          <span>99%好评</span>
        </div>
      </li>
      <li class='li_box'>
        <div class="img_box">
          <img src="https://res.vmallres.com/pimages//product/6901443323777/428_428_2F1BDEE1FA48AA45CEF803EA37F7EDE62A5F333E5AB30D20mp.png" alt="">
        </div>
        <h2>华为手机20s</h2>
        <div class="price_box">
          <span class="price">￥1200.00</span>
          <span class="select_icon">多款可选</span>
        </div>
        <ul class="feature_box">
          <li>好使</li>
          <li>限时抢购</li>
        </ul>
        <div class="comment_box">
          <span>34343人评价</span>
          <span>99%好评</span>
        </div>
      </li>
      <li></li>
      <li ></li>
    </ul>
  </div>
</body>
</html>
<script src="./index.js"></script>